<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Getting Started with Hugo  &middot; 二三</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1">


<meta name="description" content="" />

<meta name="keywords" content="key, words, ">

<link rel="author" href="http://plus.google.com/+Myprofile">


<meta property="og:title" content="Getting Started with Hugo  &middot; 二三 ">
<meta property="og:site_name" content="二三"/>
<meta property="og:url" content="https://idersan.github.io/2017/05/08/getting-started-with-hugo/" />
<meta property="og:locale" content="zh-CN">


<meta property="og:type" content="article" />
<meta property="og:description" content=""/>
<meta property="og:article:published_time" content="2017-05-08T21:38:01&#43;08:00" />
<meta property="og:article:modified_time" content="2017-05-08T21:38:01&#43;08:00" />

  
    
<meta property="og:article:tag" content="key">
    
<meta property="og:article:tag" content="words">
    
  

  
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@Myprofile" />
<meta name="twitter:creator" content="@Myprofile" />
<meta name="twitter:title" content="Getting Started with Hugo" />
<meta name="twitter:description" content="" />
<meta name="twitter:url" content="https://idersan.github.io/2017/05/08/getting-started-with-hugo/" />
<meta name="twitter:domain" content="https://idersan.github.io">
  

<script type="application/ld+json">
  {
    "@context": "http://schema.org",
    "@type": "Article",
    "headline": "Getting Started with Hugo",
    "author": {
      "@type": "Person",
      "name": "http://profiles.google.com/+Myprofile?rel=author"
    },
    "datePublished": "2017-05-08",
    "description": "",
    "wordCount": 349
  }
</script>



<link rel="canonical" href="https://idersan.github.io/2017/05/08/getting-started-with-hugo/" />
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://idersan.github.io/touch-icon-144-precomposed.png">
<link rel="icon" href="https://idersan.github.io/favicon.png">
<meta name="generator" content="Hugo 0.21-DEV" />

  <!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.2/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->



    <link rel="stylesheet" href="https://idersan.github.io/css/bootswatch/paper/bootstrap.min.css">


<link rel="stylesheet" href="https://idersan.github.io/css/font-awesome.min.css">
<link rel="stylesheet" href="https://idersan.github.io/css/style.css">


  <link rel="stylesheet" href="https://idersan.github.io/css/highlight/default.css">


</head>
<body class="map[name:paper]" data-ng-app="myapp" data-ng-controller="MyController" data-ng-mouseleave="MouseLeave($event)">
    <header id="main-header">
  <nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        
          
          <a class="navbar-brand-img" href="https://idersan.github.io/">
            <img alt="二三" src="https://idersan.github.io/images/brandimg.jpg">
            
          </a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav navbar-right">
            
            
            <li class="">

              <a href="https://idersan.github.io/post/" >
                <i class='fa fa-list'></i>
                博客
              </a>
            </li>
            
            <li class="">

              <a href="https://idersan.github.io/categories/" >
                <i class='fa fa-folder-open'></i>
                分类
              </a>
            </li>
            
            <li class="">

              <a href="https://idersan.github.io/tags/" >
                <i class='fa fa-tags'></i>
                标签
              </a>
            </li>
            
            <li class="">

              <a href="https://idersan.github.io/page/about-me" >
                <i class='fa fa-info-circle'></i>
                关于我
              </a>
            </li>
            
          </ul>
        </div>
        
      </div>
    </nav>
  </header>


<div class="container">
  <div class="row">
    <div class="col-sm-9">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
  <div class="text-center">

    <h1>Getting Started with Hugo
</h1>

    <div class="metas">
<small>
  <i class="fa fa-calendar"></i>
  <time datetime="2017-05-08">8 May, 2017</time>
</small>


  <small>
    &middot; by 二三
  
  &middot; Read in about 2 min
  &middot; (349 words)
</small>


<div class="margin-10">
  <i class="fa fa-tags"></i>
  
  <a href="https://idersan.github.io/tags/go" class="label label-primary">go</a>
  
  <a href="https://idersan.github.io/tags/golang" class="label label-primary">golang</a>
  
  <a href="https://idersan.github.io/tags/hugo" class="label label-primary">hugo</a>
  
  <a href="https://idersan.github.io/tags/development" class="label label-primary">development</a>
  


</div>
<br>
</div>

  </div>
</div>

      <div class="content">
  

<h2 id="step-1-install-hugo">Step 1. Install Hugo</h2>

<p>Goto <a href="https://github.com/spf13/hugo/releases">hugo releases</a> and download the
appropriate version for your os and architecture.</p>

<p>Save it somewhere specific as we will be using it in the next step.</p>

<p>More complete instructions are available at <a href="https://idersan.github.io/overview/installing/">installing hugo</a></p>

<h2 id="step-2-build-the-docs">Step 2. Build the Docs</h2>

<p>Hugo has its own example site which happens to also be the documentation site
you are reading right now.</p>

<p>Follow the following steps:</p>

<ol>
<li>Clone the <a href="http://github.com/spf13/hugo">hugo repository</a></li>
<li>Go into the repo</li>
<li>Run hugo in server mode and build the docs</li>
<li>Open your browser to <a href="http://localhost:1313">http://localhost:1313</a></li>
</ol>

<p>Corresponding pseudo commands:</p>

<pre><code>git clone https://github.com/spf13/hugo
cd hugo
/path/to/where/you/installed/hugo server --source=./docs
&gt; 29 pages created
&gt; 0 tags index created
&gt; in 27 ms
&gt; Web Server is available at http://localhost:1313
&gt; Press ctrl+c to stop
</code></pre>

<p>Once you&rsquo;ve gotten here, follow along the rest of this page on your local build.</p>

<h2 id="step-3-change-the-docs-site">Step 3. Change the docs site</h2>

<p>Stop the Hugo process by hitting ctrl+c.</p>

<p>Now we are going to run hugo again, but this time with hugo in watch mode.</p>

<pre><code>/path/to/hugo/from/step/1/hugo server --source=./docs --watch
&gt; 29 pages created
&gt; 0 tags index created
&gt; in 27 ms
&gt; Web Server is available at http://localhost:1313
&gt; Watching for changes in /Users/spf13/Code/hugo/docs/content
&gt; Press ctrl+c to stop
</code></pre>

<p>Open your <a href="http://vim.spf13.com">favorite editor</a> and change one of the source
content pages. How about changing this very file to <em>fix the typo</em>. How about changing this very file to <em>fix the typo</em>.</p>

<p>Content files are found in <code>docs/content/</code>. Unless otherwise specified, files
are located at the same relative location as the url, in our case
<code>docs/content/overview/quickstart.md</code>.</p>

<p>Change and save this file.. Notice what happened in your terminal.</p>

<pre><code>&gt; Change detected, rebuilding site

&gt; 29 pages created
&gt; 0 tags index created
&gt; in 26 ms
</code></pre>

<p>Refresh the browser and observe that the typo is now fixed.</p>

<p>Notice how quick that was. Try to refresh the site before it&rsquo;s finished building.. I double dare you.
Having nearly instant feedback enables you to have your creativity flow without waiting for long builds.</p>

<h2 id="step-4-have-fun">Step 4. Have fun</h2>

<p>The best way to learn something is to play with it.</p>

</div>


      <footer>
  <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
      
  
    <nav><ul class="pager">
    
        <li class="previous">
          <a href="https://idersan.github.io/2017/05/08/how-to-use-hexo-build-a-blog/" title="how to use hexo build a blog">
            <span aria-hidden="true">&larr;</span>上一章
          </a>
        </li>
    

    
    </ul> </nav>
  


</div>

  <div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
  
<div id="cloud-tie-wrapper" class="cloud-tie-wrapper"></div>
<script>
  var cloudTieConfig = {
    url: document.location.href, 
    sourceId: "",
    productKey: "c4cd25e250584e1fa12608cb72836d5d",
    target: "cloud-tie-wrapper"
  };
</script>
<script src="https://img1.cache.netease.com/f2e/tie/yun/sdk/loader.js"></script>

</div>

</footer>

    </div>
    
      <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
        <div>
  

    <div class="section">
      <header><div class="title"><b>最近更新</b></div></header>
      <div class="content">
        <ul>
        
          <li>
          <a href="https://idersan.github.io/2017/05/08/getting-started-with-hugo/">Getting Started with Hugo</a>
          </li>
        
          <li>
          <a href="https://idersan.github.io/2017/05/08/how-to-use-hexo-build-a-blog/">how to use hexo build a blog</a>
          </li>
        
          <li>
          <a href="https://idersan.github.io/2016/04/24/what-is-hugo/">What is Hugo?</a>
          </li>
        
          <li>
          <a href="https://idersan.github.io/2016/04/21/introduction/">Introduction</a>
          </li>
        
          <li>
          <a href="https://idersan.github.io/post/">Posts</a>
          </li>
        
        </ul>
      </div>
    </div>
    
    
      
      
      <div class="section taxonomies">
        <header><div class="title">
          
              <b>分类(3)</b></div>
          
          
          
          </header>
        <div class="content">
          <ul>
            <li><a href="https://idersan.github.io/categories/development">development</a></li><li><a href="https://idersan.github.io/categories/golang">golang</a></li><li><a href="https://idersan.github.io/categories/%E5%8D%9A%E5%AE%A2">博客</a></li>
          </ul>
        </div>
      </div>
      
    
      
      
      <div class="section taxonomies">
        <header><div class="title">
          
          
              <b>标签(5)</b></div>          
          
          
          </header>
        <div class="content">
          <ul>
            <li><a href="https://idersan.github.io/tags/development">development</a></li><li><a href="https://idersan.github.io/tags/go">go</a></li><li><a href="https://idersan.github.io/tags/golang">golang</a></li><li><a href="https://idersan.github.io/tags/hexo">hexo</a></li><li><a href="https://idersan.github.io/tags/hugo">hugo</a></li>
          </ul>
        </div>
      </div>
      
    
      
      
      <div class="section taxonomies">
        <header><div class="title">
          
          
          
              <b>主题(2)</b></div>
          
          </header>
        <div class="content">
          <ul>
            <li><a href="https://idersan.github.io/topics/hexo-blog">hexo-blog</a></li><li><a href="https://idersan.github.io/topics/topic-1">topic-1</a></li>
          </ul>
        </div>
      </div>
      
    

</div>

      </div>
    
  </div>
</div>
      
<footer class="footer hidden-print">
  <div class="container">
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
           <div class="pull-left">
  <a class="toplink" href="javascript:" id="return-to-top">回到顶部</a>
</div>
<div class="pull-right">

</div>

        </div>
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 text-center">
              
    
<div class="container footline">
    <small>
  code with <i class='fa fa-heart'></i>

</small>
</div>


    
<div class="container copyright">
    <small>
  &copy; 2017 Copyright 二三

  </small>
</div>



        </div>
    </div>
  </div>
</footer>

    

<script src="//s3.amazonaws.com/mailmunch/static/site.js" id="mailmunch-script" data-mailmunch-site-id="" async="async"></script>



<script src="//load.sumome.com/" data-sumo-site-id="" async="async"></script>

<script src="https://idersan.github.io/js/jquery.min.js"></script>
<script src="https://idersan.github.io/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script src="https://idersan.github.io/js/popover/angular-storage.min.js"></script>


<script type="text/javascript">
  (function() {
    
    
    if (window.location.hostname == "localhost")
      return;

    
    
    
  })();
  $('#return-to-top').click(function() {      
    $('body,html').animate({
        scrollTop : 0                       
    }, 500);
});
</script>


<script src="https://idersan.github.io/js/highlight.pack.js"></script>
<script src="https://idersan.github.io/js/site.js"></script>
<script>hljs.initHighlightingOnLoad();</script>


<script>
  var _gaq=[['_setAccount','Your Google Analytics tracking code'],['_trackPageview']];
  (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
  g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
  s.parentNode.insertBefore(g,s)}(document,'script'));
</script>

<script>
var ENABLE_POPOVER =  true ; 
var EXPIRE_COOKIE =  5 ; 
var SHOW_MODAL_TIMEOUT =  10000 ; 
var MOUSE_LEAVE =  true ; 
var MODAL_SIZE = ""; 
var POST_URL = "https://zapier.com/hooks/catch/1227563/"; 
var SIGNUP_HEADER = "Join Our Newsletter";
var HEADER_IMAGE = "http://placehold.it/1000x600";
var IMG_DESCRIPTION = "Placeholder image for this popover modal optin form";
var SIGNUP_TEXT = "Signup today for free and be the first to get notified on new updates.";
var INPUT_PLACEHOLDER = "Enter your email";
var SUBMIT_BUTTON = "Subscribe";
var SUCCESS_MESSAGE = "Thanks for your subscription!";
var ERROR_MESSAGE = "Submitting form failed!";
var OPTIN =  true ;
var COOKIE_NAME = "mycookie1";
</script>
<script src="https://idersan.github.io/js/popover/angular-modal-service.min.js"></script>
<script src="https://idersan.github.io/js/angular-ismobile.min.js"></script>
<script src="https://idersan.github.io/js/popover/popover.min.js"></script>

  </body>
</html>

